<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@ page session="true" %>
<%@ page import="javax.portlet.*" %>
<%@page import ="rai.dto.*" %>
<%@page import ="rai.dao.*" %>
<%@page import = "java.util.*" %>

<%@ taglib uri="http://java.sun.com/portlet" prefix="portlet"%>
<%@ taglib uri="http://java.sun.com/jstl/core" prefix="c"%>
<portlet:defineObjects/>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Personal Information Tracking System</title>
<meta name="keywords" content="" />
<meta name="description" content="" />
<script type="text/javascript" src='<%=request.getContextPath() +"/js/calendarDateInput.js"%>'></script> 
<script type="text/javascript">
	function getForm(namespace, name) {
	    return document.forms[namespace + name];
	}
	function back_to_emp_info_form(namespace, name) {
	    var frm = getForm(namespace, name);
	    frm.txtAction.value = "back_to_empInfo_form_2";
	    frm.submit();
	}
	function back_to_login(namespace, name) {
		var frm = getForm(namespace, name);
		frm.txtAction.value = "back_to_login_form";
		frm.submit();
	}
	function add_exp_action(namespace,name){
		var frm = getForm(namespace, name);
		var start = frm.periodFrom.value;
		var end = frm.periodTo.value;
		
		var startDate = new Date(start.substring(4,8),start.substring(2,4),start.substring(0,2));
		var endDate = new Date(end.substring(4,8),end.substring(2,4),end.substring(0,2));
		if(startDate.getTime() > endDate.getTime()) {
			alert('End Date must be after Start Date');
		}else {
			frm.txtAction.value = "add_emp_exp";
			frm.submit();
		}
	}
	function asynchGet(updateURL,lstresponse){
		 
	    if (window.XMLHttpRequest) {
	        portletReq = new XMLHttpRequest();
	    } else if (window.ActiveXObject) {
	        portletReq = new ActiveXObject("Microsoft.XMLHTTP");
	    }
	  // alert(updateURL+" "+ lstresponse);
	    portletReq.onreadystatechange = function() {processReqChange(lstresponse);};
	    
	    portletReq.open("GET", updateURL, true);
	    //alert(updateURL);
	    portletReq.send(null);
	}
	function processReqChange(lstresponse) {
		//alert(portletReq.status+" "+portletReq.readyState);
		//alert(lstresponse);
	    if (portletReq.readyState == 4) {
	        if (portletReq.status == 200) {
	            // process response
	            //alert("proccess");
	            displayDepartment(lstresponse);
	        }
	    }
	}
	function selectComp(evt,lstresponse) {
		
	    evt = (evt) ? evt : ((window.event) ? window.event : null);
	    if (evt) {
	    	
	        var select = (evt.target) ? evt.target : ((evt.srcElement) ? evt.srcElement : null);
	        if (select && select.options.length > 1) {
	        	 //alert(lstresponse);
	        	asynchGet('<%=request.getContextPath()%>'+"/AddActionServlet?lstComp=" + select.value+"&name="+lstresponse,lstresponse);
	        }
	    }
	}
		
	function displayDepartment(lstresponse) {
	    // substitute new invoice HTML content into "portletcontent" <div> tag
	    //alert(lstid);
	   // alert(lstresponse);
	    //alert("result"+portletReq.responseText);
	    var div = document.getElementById(lstresponse);
	    //alert(portletReq.responseText);
	    div.innerHTML = "";
	   	var result = portletReq.responseText.split('######');
	    div.innerHTML = result[0];
	    div = document.getElementById('compAdd');
	    div.innerHTML = result[1];
	    div = document.getElementById('compPhone');
	    div.innerHTML = result[2];
	}

	function init() {
		asynchGet('<%= request.getContextPath()+"/AddActionServlet?lstComp=1&name=lstDept"%>','lstDept');
		div = document.getElementById('lstDept');
		div.innerHTML = "<select name=\"lstDept\" disabled > <option value=\"0\">None</option> </select>";
	}
</script>
<link href='<%=request.getContextPath()+"css/style.css"%>' rel="stylesheet" type="text/css" media="screen" />
</head>

<body onload="init()">
<form name="<portlet:namespace/>editExpForm" action="<portlet:actionURL/>" method="POST">
	<input type="hidden" name="txtAction" />
	<%String succMess = (String)session.getAttribute("succMess");%>
<table align="center">
	<tr class="title">
			<td>		
					<h1><font color="blue">Personal information tracking system </font></h1>
					<p>Exploit the value of data</p>
					<hr />
			</td>
	</tr>	
	<tr>
		<td colspan="2" align="left"> Welcome, <font color="orange"/><b>[${sessionScope.role}]${sessionScope.name}</b></font>
		| <a href="#" onclick="back_to_emp_info_form('<portlet:namespace/>','editExpForm')">Home</a>
		| <a href="#" onclick="back_to_login('<portlet:namespace/>','editExpForm')">Logout</a>
	   </td>
	</tr>
	
	<tr>	
		<td>
			<table border="1">
				<tr>
					<td><h2 class="title"><font color="orange">Experience Information</font></h2></td>
				</tr>
					
				<tr>
					<td><p><em>General Information </em></p></td>
				</tr>
				<tr>
					<td>
						<table border="1" width="100%">							
							<tr>
							  <td align="left" valign="bottom">&nbsp;Company</td>
							  <td align="left" valign="middle" colspan="2">
							  	<select name="lstCompAdd" onchange ="selectComp(event,'lstDept')">
							  		<%SearchInfoDAO daoSearch = new SearchInfoDAO();
							  		  List<CompanyDTO> lst_comp = daoSearch.getComp();
							  		  for(int i=1;i<lst_comp.size();i++) {
							  		  	CompanyDTO temp = lst_comp.get(i);
							  		%>
							  			<option value="<%=temp.getId() %>"><%=temp.getSname() %></option>
							  		<%} %>
							  	</select>
							  </td>
							</tr><tr>
							  <td align="left" valign="bottom">&nbsp;Address&nbsp;</td>
							  <td align="left" valign="middle" colspan="2"><div id="compAdd"></div></td>
							</tr>
							<tr>
							  <td align="left" valign="bottom">&nbsp;Phone&nbsp;</td>
							  <td align="left" valign="bottom" colspan="2"><div id="compPhone"></div></td>
							</tr> 							
							  
						  	
						  	<tr>
								<td>&nbsp;Department&nbsp;</td>
								<td colspan="2" align="left" valign="middle">
								  <div id="lstDept"></div>								  
							 	</td>  
						  </tr>
							
							<tr>
							  <td align="left" valign="middle" rowspan="2">&nbsp;Working Period&nbsp;</td>
							  <td align="left" valign="bottom">From</td>
							  <td align="left" valign="middle">&nbsp;
							  <%String path = request.getContextPath(); %>
										<script>DateInput('periodFrom', true, 'DD/MM/YYYY','<%=path%>');</script></td>  							 
						  </tr>
						  <tr>
							  	<td align="left" valign="bottom">&nbsp;To&nbsp;</td>
						  		<td align="left" valign="bottom">&nbsp;
										<script>
											DateInput('periodTo', true, 'DD/MM/YYYY','<%=path%>');
										</script>							  </td>
						  </tr>
						  <tr>
							  	<td align="left" valign="bottom">&nbsp;Role&nbsp;</td>
								<td><textarea name="projectRole" rows="1" cols="5"></textarea></td>
						  		<td align="left" valign="middle"><select name="lstRole">
						  		 									<%EditTakenProjectDAO dao1 = new EditTakenProjectDAO();
						  		 									  List<RoleDTO> lst_role = dao1.getRole();
						  		 									  for(int i=0;i<lst_role.size();i++){
						  		 									  	RoleDTO role = lst_role.get(i);
						  		 									 %>
						  		 									  	<option value='<%=role.getId() %>'><%=role.getSname() %></option>
						  		 									  <%} %>
                                                                </select>
								</td>
								
						  </tr>
						  <tr>
						  	<td>More Description</td>
							<td colspan="2"><textarea name="txtDes"></textarea></td>
						  </tr>

						  <tr align="left" valign="bottom">
						  	  <td colspan="3"><input type="button" name="btnADD" value="Add" onclick="add_exp_action('<portlet:namespace/>','editExpForm')"/><input type="button" name="Button2" value="Cancel" onclick="back_to_emp_info_form('<portlet:namespace/>','editExpForm')"/>
						  	  <p style=""><b><font color="red">${sessionScope.succMess}</font></b></p>
						  	  </td>
						  </tr>
				    </table>					</td>
				</tr>
			</table>			
		</td>
	</tr>
	<tr>
		<td colspan="2">
			<div style="clear: both;">&nbsp;</div>
			<div id="footer"><p>Development by HCMUT-Grp3.</p>
			</div>
		</td>
	</tr>
</table>
</form>
</body>